<template>
  <div class="person">
    <h1>我是Person组件</h1>
    <h2>名字：{{name}}</h2>
    <h2>年龄：{{age+1}}</h2>
    <h2>座驾：{{car}}</h2>
  </div>
</template>

<script>
  export default {
    name:'Person',
    // 第一种接收方式：只接收
    // props:['name','age','car'],

    // 第二种接收方式：接收+限制数据类型
    /* props:{
      name:String,
      age:Number,
      car:Object
    } */

    // 第三种接收方式：接收+限制数据类型+限制必要性+指定默认值
    props:{
      name:{
        type:String,
        required:true,
        default:'旺财'
      },
      age:{
        type:Number,
        required:true,
        default:99999
      },
      car:{
        type:Object,
        required:true,
        default(){
          return {name:'自行车',price:'100'}
        }
      }
    }

  }
</script>

<style scoped>
  .person {
    background-color: orange;
    padding: 20px;
    box-shadow: 0 0 10px black;
    border-radius: 10px;
  }
</style>